import React, { Component } from 'react';
import {register} from '../utils/api'
class App extends Component {
  constructor(props){
    super(props);
    this.state = {
      phone:'',
      pass:'',
      checkpass:''
    }
  }
  register(){
     if(this.state.phone && this.state.pass && this.state.checkpass){
      if(this.state.pass === this.state.checkpass)
      {
      var {checkpass,...params} = this.state
      register(params).then((res)=>{
        if(res.data.code === 200){
          alert(res.data.msg)
        }else{
          alert(res.data.msg)
        }
      })
      }
      this.props.history.push('/login')
     }
  }
  handleChange(e){
    this.setState({
      [e.currentTarget.name]:e.currentTarget.value,
    })
  }
  render() {
    return (
      <div className='app'>
          <div className='register'>
            <div className='title'>注册页</div>
            <div className='input'>
              <input type="text" placeholder='输入账号' name='phone' defaultValue={this.state.phone} onChange={(e)=>{this.handleChange(e)}}/>
            </div>
            <div className='input'>
              <input type="password" placeholder='输入密码' name='pass' defaultValue={this.state.pass} onChange={(e)=>{this.handleChange(e)}}/>
            </div>
            <div className='input'>
              <input type="password" placeholder='确认密码' name='checkpass' defaultValue={this.state.checkpass} onChange={(e)=>{this.handleChange(e)}}/>
            </div>
            <div className='input'>
              <input onClick={()=>{this.register()}} type="button" value="注册"/>
            </div>
          </div>
      </div>
    );
  }
}

export default App;